@import '../global/dpr.scss';

body {
    height: 100vh;
    .heade {
        .pd {
            padding: 0.5333rem 0.4rem;
        }
        .search-wrap {
            position: relative;
            display: flex;
            align-items: center;
            width: 100%;
            height: 0.8rem;
            i {
				padding: 10px 0;
                color: #fff;
                @include font-dpr(18px);
            }
            .sy {
                padding-right: 0.266666rem;
                color: #fff;
                @include font-dpr(14px);
            }
            .mui-icon-search {
                position: absolute;
                left: 2rem;
                top: 50%;
                transform: translateY(-50%);
            }
			.right-icon {
				padding: 0.266666rem;
			}
            input {
                margin: 0;
                border: none;
                padding-left: 1.333333rem;
                width: 6.666666rem;
                height: 100%;
                background: #1c73ba;
                @include font-dpr(14px);
            }
            input::-webkit-input-placeholder {
                color: #ddd;
            }
            input::-moz-input-placeholder {
                color: #ddd;
            }
            input::-ms-input-placeholder {
                color: #ddd;
            }
        }
    }
    .container {
        width: 8.4rem;
        height: 11.666666rem;
        background: #fff;
        margin: 0.666666rem auto;
        border-radius: 0.066666rem;
        .container-heade {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            height: 3.866666rem;
            margin: 0 0.8rem;
            border-bottom: 1px solid #eee;
            .photo {
                width: 1.2rem;
                height: 1.2rem;
                img {
                    width: 100%;
                    height: 100%;
                }
            }
            h2 {
                padding-top: 0.4rem;
                @include font-dpr(16px);
            }
            p {
                padding-top: 0.2rem;
                @include font-dpr(12px);
                color: #bbb;
            }
        }
        .container-content {
            .title {
                height: 0.8rem;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 0 0.4rem;
                border-bottom: 1px solid #eee;
                margin-top: 50px;
                @include font-dpr(14px);
                i {
                    @include font-dpr(14px);
                }
            }
            ul {
                li {
                    height: 1.533333rem;
                    display: flex;
                    align-items: center;
                    padding: 0 0.533333rem;
                    border-bottom: 1px solid #eee;
                    img {
                        width: 0.866666rem;
                        height: 0.866666rem;
                    }
                    .li-right {
                        height: 0.8rem;
                        padding-left: 0.4rem;
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        h3 {
                        }

                        p {
                            @include font-dpr(10px);
                            padding-top: 0.066666rem;
                        }
                    }
                }
            }
        }
    }
	#picture {
		.mui-table-view {
			.mui-table-view-cell {
				height: 1.2rem;
				padding: 0;
				a{
					width: 100%;
					height: 100%;
					margin: 0;
					color:#000;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
		}
	}
}
